<template>
	<view>
		<scroll-view v-if="TaskHistory.length > 0" scroll-y style="height: 99%;" @scrolltolower="loadMore" >
			<block v-for="(item,index) in TaskHistory" :key="index" >
				<view class="zcModel-card">
					<view class="zcModel-card-item uni-flex zcAlignI_center history_title">
						<view>任务时间：</view>
						<view>{{item.TraceTaskDueDate}}</view>
					</view>
					<view class="zcModel-card-item uni-flex zcAlignI_center">
						<view>跟进时间：</view>
						<view>{{item.TraceDate}}</view>
					</view>
					<view class="zcModel-card-item uni-flex zcAlignI_center">
						<view>跟进结果：</view>
						<view>{{item.TraceResult}}</view>
					</view>
					<view class="zcModel-card-item uni-flex zcAlignI_center">
						<view>跟进原因：</view>
						<view>{{item.TraceResultReasonName}}</view>
					</view>
					<view class="zcModel-card-item uni-flex">
						<view style="flex-shrink: 0;">跟进内容：</view>
						<view class="zcModel-card-item-text">{{item.Content}}</view>
					</view>
				</view>
			</block>
		</scroll-view>
		<view class="uni-tab-bar-loading">
			{{loadingText}}
		</view>
		<view v-if="TaskHistory.length < 1 && isNoDataShow" class="uni-tab-bar-loading" style="text-align: center;">
			<view class="no_model">
				<image :src="imgPath+'UniImages/no_data.png'" mode="widthFix" style="width: 100%;"></image>
				<view class="no_text">暂无数据</view>
			</view>
		</view>
        </view>
	</view>
</template>

<script>
	
	let _this;
	export default {
		data() {
			return {
				isNoDataShow:false,
				SaleChanceSN:'',
				pageIndex:0,
				dataLength:0,
				loadingText:'',
				TaskHistory:[],
				imgPath:this.$ZcPublic.Domain
			}
		},
		onLoad(e) {
			_this = this;
			
			if (e.SaleChanceSN) {
				_this.SaleChanceSN = e.SaleChanceSN;
				_this.zcQueryTraceTaskList();
			}
		},
		methods: {
			loadMore() {
				if (_this.dataLength < 20) {
					return;
				}
				_this.loadingText = '加载中';
				_this.zcQueryTraceTaskList();
			},
			zcQueryTraceTaskList() {
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				_this.$ZcPublic.Server.Post({
					IsNeedLogin: true,
					Paras: {
						Name: 'uni_Insure_Detail',
						Action: 'Ext_QueryTraceTaskList',
						Data: {
							SaleChanceSN:_this.SaleChanceSN,
							IsCompleted:true,		//是否完成
							SaleChanceCategory: '',		//线索类别（仅用于未完成）
							DueDate: '',		//预计跟进日期（仅用于未完成）
							StartRow: _this.pageIndex,	//开始行（用于分页）
							RowCount: 20		//每页数量，默认为50
						}
					},
					Callback:function(resjson,scope) {
						if (resjson.state === 'back') {
							console.log('回访 历史列表 = ',resjson.data);
							if (!resjson.success) {
								uni.showModal({
									title:'温馨提示',
									showCancel:false,
									content:''+resjson.msg
								})
								return;
							}
							
							if (resjson.data!==null && resjson.data.length > 0) {
								_this.pageIndex = _this.pageIndex+resjson.data.length;	// 初始化 下次加载开始下标
								_this.dataLength = resjson.data.length;
								if (_this.dataLength < _this.pages) {
									if (_this.pageIndex >= _this.pages) {
										_this.tabBar.loadingText = '没有更多了...';
									}else{
										_this.tabBar.loadingText = '';
									}
								}else {
									_this.tabBar.loadingText = '加载更多';
								}
								
								
								for (let i = 0; i < resjson.data.length; i++) {
									_this.TaskHistory.push(resjson.data[i]);
								}
							}else {
								_this.isNoDataShow = true;
							}
						}
                        if (resjson.state === 'end') {
                            uni.hideLoading();
                        }
						
					},
					Scope: this
				})
			}
		}
	}
</script>

<style>
	.zcModel-card{margin-bottom: 30upx;padding: 20upx 30upx 45upx 30upx;background-color: #FFFFFF;}
	.zcModel-card-item{font-size: 30upx;box-sizing: border-box;}
	.zcModel-card-item view{display: flex;box-sizing: border-box;line-height: 1.6;}
	/* .zcModel-card-item view{display: flex;box-sizing: border-box;} */
	.zcModel-card-item view:first-child{min-width: 140upx;}
	.zcModel-card-item view:last-child{line-height: 1.3;}
	.zcModel-card-item-text{white-space: normal;display: block;padding-top: 8upx;}
	/* 2019-10-25样式修改 */
	.zcModel-card>view>view{
		height: 50upx !important;
		line-height: 50upx !important;
	}
		.zcModel-card>view:nth-of-type(2){
			margin-top: 20upx;
		}
	.history_title{
		border-bottom: 1upx solid #F4F4F4;
		height: 80upx;
		line-height: 80upx;
	}
	.history_title>view{
				font-size: 34upx;
	}
	.zcModel-card{
		margin: 30upx 10upx;
		background-color: #FFFFFF;
		box-shadow: 1upx 1upx 5upx 5upx #F4F4F4;
		border-radius: 10upx;
		}
	/* 无数据样式 */
	.no_model{position: relative;display: flex;flex-direction: column;align-items: center;padding: 0 160upx;padding-top: 100upx;}
	.no_text{font-size: 30upx;color: #999999;position: absolute;bottom: 28upx;}	
</style>
